<template>
    <div class="search-article-Lists">
        <content-list :contentList="articleDatas"></content-list>
    </div>
</template>
<script>
import ContentList from "../ContentList";
import { getAllArticle } from "../../api/index";

export default {
    name: "search-article-lists",
    components: {
        ContentList,
    },
    data() {
        return {
            articleDatas: [
                {
                    pic: "https://pic1.zhimg.com/v2-1593823aa77d0080d506824ffb744be2_r.jpg?source=1940ef5c",
                    name: "测试数据",
                    title: "测试标题",
                    content: "测试文章",
                },
                {
                    pic: "https://pic1.zhimg.com/v2-1593823aa77d0080d506824ffb744be2_r.jpg?source=1940ef5c",
                    name: "测试数据",
                    title: "测试标题",
                    content: "测试文章",
                },
                {
                    pic: "https://pic1.zhimg.com/v2-1593823aa77d0080d506824ffb744be2_r.jpg?source=1940ef5c",
                    name: "测试数据",
                    title: "测试标题",
                    content: "测试文章",
                },
                {
                    pic: "https://pic1.zhimg.com/v2-1593823aa77d0080d506824ffb744be2_r.jpg?source=1940ef5c",
                    name: "测试数据",
                    title: "测试标题",
                    content: "测试文章",
                },
                {
                    pic: "https://pic1.zhimg.com/v2-1593823aa77d0080d506824ffb744be2_r.jpg?source=1940ef5c",
                    name: "测试数据",
                    title: "测试标题",
                    content: "测试文章",
                },
                {
                    pic: "https://pic1.zhimg.com/v2-1593823aa77d0080d506824ffb744be2_r.jpg?source=1940ef5c",
                    name: "测试数据",
                    title: "测试标题",
                    content: "测试文章",
                },
                {
                    pic: "https://pic1.zhimg.com/v2-1593823aa77d0080d506824ffb744be2_r.jpg?source=1940ef5c",
                    name: "测试数据",
                    title: "测试标题",
                    content: "测试文章",
                },
                {
                    pic: "https://pic1.zhimg.com/v2-1593823aa77d0080d506824ffb744be2_r.jpg?source=1940ef5c",
                    name: "测试数据",
                    title: "测试标题",
                    content: "测试文章",
                },
            ],
        };
    },
    mounted() {
        this.getSearchList();
    },
    methods: {
        getSearchList() {
            if (!this.$route.query.keywords) {
                this.notify("您输入的内容为空", "warning");
            } else {
                getAllArticle({
                    keywords: this.$route.query.keywords,
                }).then((res) => {
                    if (res) {
                        this.articleDatas = res;
                    } else {
                        this.notify("暂无该文章内容", "warning");
                    }
                });
            }
        },
    },
};
</script>

<style lang="scss" scoped>
@use "../../assets/css/search-article-lists.scss";
</style>
